<template>
    <div>
        <div style="margin: 30px 20px;font-size: 14px;">
            <div>
                *自动组卷逻辑
            </div>
            <p>
                1. 以卷面总分为上限，自动组卷时需配置
                <span class="bold">选择题占比</span>、
                <span class="bold">多选题占比</span>、
                <span class="bold">填空题占比</span>、
                <span class="bold">判断题占比</span>
                系统自动按照<span class="bold">现有题库存量、所属科目、题目难度、题目练习价值</span>等多维度数据组卷。
            </p>
            <p>
                2. 题库不足，系统只能尽量生成，望周知。
            </p>
        </div>
        <div style="margin: 30px 20px;font-size: 14px;">
            <div>
                功能启用开关
                <el-switch v-model="value" active-color="#bec936" inactive-color="#f1f1f1">
                </el-switch>
            </div>
            <div v-if="value" style="margin: 30px 0;">
                <div style="color:#5d655f">*组卷配置</div>
                <div style="margin: 35px 0;">
                    <span style="margin-right: 10px;">单选题占比</span>
                    <el-input-number size="mini" v-model="oneSelected" :min="0" :max="100"
                        label="选择题"></el-input-number>
                </div>
                <div style="margin: 35px 0;">
                    <span style="margin-right: 10px;">多选题占比</span>
                    <el-input-number size="mini" v-model="doubleSelected" :min="0" :max="100"
                        label="多选题"></el-input-number>
                </div>
                <div style="margin: 35px 0;">
                    <span style="margin-right: 10px;">填空题</span>
                    <el-input-number size="mini" v-model="putWord" :min="0" :max="100" label="填空题"></el-input-number>
                </div>
                <div style="margin: 35px 0;">
                    <span style="margin-right: 10px;">判断题</span>
                    <el-input-number size="mini" v-model="judgeSelected" :min="0" :max="100"
                        label="判断题"></el-input-number>
                </div>
                <div style="margin: 35px 0;">
                    <span @click="autoCreatePaper" style="text-align: center;color: rgb(43, 121, 203);border-radius: 5px;display: inline-block;padding: 8px 10px;cursor: pointer;width: 190px;background-color: rgb(235, 237, 245);">
                        立即新增
                        <i class="el-icon-right"></i>
                    </span>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            value: false,
            oneSelected: 0,
            doubleSelected: 0,
            putWord: 0,
            judgeSelected: 0,
            paper: {}
        }
    },
    created() {
        this.loadPaperInfo();
    },
    methods: {
        loadPaperInfo() {
            const paperJson = sessionStorage.getItem('paperInfo');
            this.paper = JSON.parse(paperJson);
        },
        // 自动组卷
        autoCreatePaper() {
            const autoCreatePaperDto = {
                paperId: this.paper.id,
                projectId: this.paper.projectId,
                oneSelected: this.oneSelected,
                doubleSelected: this.doubleSelected,
                putWord: this.putWord,
                judgeSelected: this.judgeSelected
            }
            this.$axios.post(`/paper/autoCreatePaper`, autoCreatePaperDto).then(response => {
                const { data } = response;
                if (data.code === 200) {
                    this.$swal.fire({
                        title: '自动组卷',
                        text: '组卷成功',
                        icon: 'success',
                        showConfirmButton: false,
                        timer: 1000,
                    });
                    this.$emit('to-self', true);
                }
            })
        },
    }
};
</script>
<style scoped lang="scss">
.bold {
    font-weight: bold;
    text-decoration: underline;
}
</style>